<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>

<div class="button_area">
	<a href="javascript:void(0)" onclick='doAdd()' class="button">添加客户资料</a>&nbsp;&nbsp;
	<a class="button save">保存</a>&nbsp;&nbsp;
	<a href="customerCompany/customerCompany.action" class="button">返回</a>
</div>
<s:form method="post" action="customerCompanyUpdate" onsubmit="return composeValue();"
	namespace="/customerCompany">

	<tr>
		<td>
			<table class="form_table">
				<s:hidden name="customerCompany.custCompanyId"></s:hidden>
				<s:textfield label="公司名称" name="customerCompany.custCompanyName" size="50"
					required="true" maxlength="100"></s:textfield>
				<s:textfield label="公司地址" name="customerCompany.address" size="50"
					required="true" maxlength="100"></s:textfield>
				<s:textfield label="联系电话" name="customerCompany.phoneNumber" size="50"
					required="true" maxlength="100"></s:textfield>
			</table>
		</td>
		<td width="30">
			&nbsp;
		</td>
		<td>
			<table class="form_table">
				<s:textfield label="联系传真" name="customerCompany.faxNumber" size="30"
					 maxlength="100"></s:textfield>
				<s:textfield label="邮政编码" name="customerCompany.postalCode" size="30"
					 maxlength="100"></s:textfield>
			</table>
		</td>
	</tr>
	<tr><td><div id="append_div"></div></td></tr>

</s:form>

<br>
<br>

<style>
<!--
.form_table {
	text-align: left;
	background-color:#F4F4F4;
}
-->
</style>
<script type="text/javascript">
var sexs='<s:iterator value="sexs" status="status" ><s:property value="dictionaryID" />:<s:property value="dictionaryName" /><s:if test="!#status.last">;</s:if></s:iterator>';
var positions='<s:iterator value="titles" status="status" ><s:property value="dictionaryID" />:<s:property value="dictionaryName" /><s:if test="!#status.last">;</s:if></s:iterator>';

var GridOption={
    	datatype : "local",    
    	 colModel:[     
        		{label:'id',name:'customerId',index:'customerId',key:true, hidden:true},     
       			{label:'姓名',name:'customerName',index:'customerName', width:100,editable:true,editrules:{required:true}},     
        		{label:'性别',name:'sex',jsonmap:"sex",index:'sex', width:100,editable:true,edittype:'select',editoptions:{value:sexs}},
        		{label:'职位',name:'position',index:'position.dictionaryName', width:100,editable:true,edittype:'select',editoptions:{value:positions}},  
        		{label:'所在部门',name:'section',index:'section', width:100,editable:true},  
        		{label:'联系电话',name:'phoneNumber',index:'phoneNumber', width:100,editable:true,editrules:{required:true}},   
        		{label:'电邮地址',name:'email',index:'email', width:100,editable:true,editrules:{required:true}},
        		{label:'操作',name:'del', width:100,align:'center',sortable:false}
      ],    
     width:$(document).width()-60,
	 height: $(document).height()-300,
     onSelectRow:function(id){
     	if($('#list').isEditing())return;
      	 $('#list').editRow(id,true);
      	 sc= "<a href='javascript:void(0)' onclick=\"$('#list').restoreRow("+id+",afterSaveRow);\">取消</a>";
      	 cc= "<a href='javascript:void(0)' name='save' onclick=\"$('#list').saveRow("+id+",false,'clientArray',null,afterSaveRow);\">保存</a>";
		 $("#list").jqGrid('setRowData',id,{del:cc+" "+sc});
		 
      },
      
     gridComplete: function(){
				var ids = jQuery("#list").jqGrid('getDataIDs');
				for(var i=0;i < ids.length;i++){
					var cl = ids[i];
					var data=jQuery("#list").jqGrid('getRowData',cl);
					sc= "<a href='javascript:void(0)' onclick=\"$('#list').delRowData("+ids[i]+");\">删除</a>";
				    jQuery("#list").jqGrid('setRowData',ids[i],{del:sc});
				}
		}
    }

	var gridData=[];
	<s:if test="customers.size()>0">
	<s:iterator value="customers">
		 gridData.push({
			customerId:'<s:property value="customerId"/>',
			customerName:'<s:property value="customerName"/>',
			sex:'<s:property value="sex"/>',
			position:'<s:property value="position"/>',
			section:'<s:property value="section"/>',
			phoneNumber:'<s:property value="phoneNumber"/>',
			email:'<s:property value="email"/>'
		});
	</s:iterator>
	</s:if>




function composeValue(){
	 $('#append_div').empty();
	 var ids = $("#list").jqGrid('getDataIDs');
	 for(var i=0;i < ids.length;i++){
		var cl = ids[i];
	 	var data=$("#list").jqGrid('getRowData',cl);
	 	if(data.customerId>0){
	 		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].customerId\" value='"+data.customerId+"'/>");
	 	}
		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].customerName\" value='"+data.customerName+"'/>");
		$('#append_div').append("<input type=hidden name=\"customerCompany.customers["+i+"].sex\" value='"+data['sex']+"'/>");	
		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].position\" value='"+data['position']+"'/>");	
		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].section\" value='"+data['section']+"'/>");	
		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].phoneNumber\" value='"+data.phoneNumber+"'/>");	
		$('#append_div').append("<input  type=hidden name=\"customerCompany.customers["+i+"].email\" value='"+data.email+"'/>");	
	}
	return false;
}  

var doAdd=function(){

    	if($('#list').isEditing())return;
    	var id = $("#list").jqGrid('getDataIDs').length+1;
    			$("#list").jqGrid('addRowData',id,{},'first');
    			bc = "<a href='javascript:void(0)' name='save' onclick=\"$('#list').saveRow("+id+",false,'clientArray',null,afterSaveRow);\">保存</a>"; 
				qx= "<a href='javascript:void(0)' onclick=\"$('#list').delRowData("+id+",afterSaveRow);\">取消</a>";
    			$("#list").jqGrid('setRowData',id,{del:bc+' '+qx});
    			$('#list').editRow(id);
    }
  var afterSaveRow=function(id){
      sc= "<a href='javascript:void(0)' onclick=\"$('#list').delRowData("+id+");\">删除</a>";
		jQuery("#list").jqGrid('setRowData',id,{del:sc});
};
 $("form").validate({
    	errorLabelContainer: $("div.error"),
    	focusInvalid: true,
    	rules: {           //定义验证规则,其中属性名为表单的name属性  
        	'customerCompany.custCompanyName': {  
        		required: true,  
               	rangelength: [2,100]//,
              	},
        	'customerCompany.address': {  
        		required: true,  
               	rangelength: [2, 100]
              	},
			'customerCompany.phoneNumber': {  
                required: true,  
                rangelength: [4,16]
            },
            'customerCompany.faxNumber': {
            	rangelength: [6,30]
            }
            ,
            'customerCompany.postalCode': {
            	number: true,
            	rangelength: [6,11]
            }
                        
         }, 
         messages: {       //自定义验证消息  
         	'customerCompany.custCompanyName': {  
            	required: "公司名称是必需的<br>",  
                rangelength: $.format("公司名称至少要{0}个字符<br>")           
         	},
         	'customerCompany.address': {  
            	required: "公司地址是必需的<br>",  
            	rangelength: $.format("公司地址应为{0}-{1}个字符<br>")  
         	},
         	'customerCompany.phoneNumber': {  
                required: "联系是必需的<br>",  
				rangelength: $.format("联系电话要在{0}-{1}个字符之间<br>")
             },  
            'customerCompany.faxNumber': {  
                rangelength: $.format("联系传真应为{0}-{1}个字符<br>")  
             },
            'customerCompany.postalCode': {
            	number: "邮政编码应为数字<br>",
            	rangelength: $.format("邮政编码应为{0}-{1}个字符之间<br>")
            }
         }
    });

$('a.save').click(function(){
    var ids=$('#list').getEditingIndexs();
    $.each(ids,function(index,id){
    	$('#list tr[id='+id+'] a[name=save]').click();
    })
    if(!$('#list').isEditing()){
    	$('form:first').trigger('submit');
    }
	return false;

})
</script>

